/* eslint-disable max-len */
/* eslint-disable react/no-unknown-property */

import React from 'react';

const headerTitleBackground = (
  <svg width="354" height="40" viewBox="0 0 354 40" fill="none" xmlns="http://www.w3.org/2000/svg">
    <g opacity="0.8">
      <path
        d="M244.089 25.0021L249.911 15.9676C254.33 9.112 261.928 4.9697 270.084 4.9697H354V4H0V4.9697H83.9156C92.0718 4.9697 99.6698 9.112 104.089 15.9676L109.911 25.0021C114.33 31.8577 121.928 36 130.084 36H223.916C232.072 36 239.67 31.8577 244.089 25.0021Z"
        fill="url(#paint0_linear_1093_23590)"
      />
      <path
        d="M244.089 25.0021L249.911 15.9676C254.33 9.112 261.928 4.9697 270.084 4.9697H354V4H0V4.9697H83.9156C92.0718 4.9697 99.6698 9.112 104.089 15.9676L109.911 25.0021C114.33 31.8577 121.928 36 130.084 36H223.916C232.072 36 239.67 31.8577 244.089 25.0021Z"
        fill="url(#paint1_linear_1093_23590)"
      />
    </g>
    <g filter="url(#filter0_f_1093_23590)">
      <path
        d="M207.345 36L146.655 36L146.655 25C146.655 13.402 156.057 4 167.655 4L186.345 4C197.943 4 207.345 13.402 207.345 25L207.345 36Z"
        fill="url(#paint2_radial_1093_23590)"
      />
    </g>
    <path
      d="M221 36L133 36V36C133 35.4477 133.448 35 134 35L220 35C220.552 35 221 35.4477 221 36V36Z"
      fill="url(#paint3_linear_1093_23590)"
    />
    <path
      opacity="0.8"
      d="M354 5H270.077C261.925 5 254.33 9.13848 249.91 15.989L244.09 25.011C239.67 31.8615 232.075 36 223.923 36H130.077C121.925 36 114.33 31.8615 109.91 25.011L104.09 15.989C99.67 9.13848 92.075 5 83.9225 5H0"
      stroke="url(#paint4_linear_1093_23590)"
    />
    <defs>
      <filter
        id="filter0_f_1093_23590"
        x="142.655"
        y="0"
        width="68.6895"
        height="40"
        filterUnits="userSpaceOnUse"
        color-interpolation-filters="sRGB"
      >
        <feFlood flood-opacity="0" result="BackgroundImageFix" />
        <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
        <feGaussianBlur stdDeviation="2" result="effect1_foregroundBlur_1093_23590" />
      </filter>
      <linearGradient id="paint0_linear_1093_23590" x1="177" y1="3" x2="177" y2="36" gradientUnits="userSpaceOnUse">
        <stop stop-color="#181C36" stop-opacity="0" />
        <stop offset="1" stop-color="#1B2F42" />
      </linearGradient>
      <linearGradient
        id="paint1_linear_1093_23590"
        x1="-2.00001"
        y1="4"
        x2="354"
        y2="3.99993"
        gradientUnits="userSpaceOnUse"
      >
        <stop stop-color="#181C36" stop-opacity="0" />
        <stop offset="0.117007" stop-color="#181C36" />
        <stop offset="0.889413" stop-color="#181C36" />
        <stop offset="1" stop-color="#181C36" stop-opacity="0" />
      </linearGradient>
      <radialGradient
        id="paint2_radial_1093_23590"
        cx="0"
        cy="0"
        r="1"
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(177 36) rotate(-90) scale(16 36.9195)"
      >
        <stop stop-color="#3CE5D3" stop-opacity="0.2" />
        <stop offset="0.0001" stop-color="#3CE5D3" stop-opacity="0.2" />
        <stop offset="1" stop-color="#3CE5D3" stop-opacity="0" />
      </radialGradient>
      <linearGradient id="paint3_linear_1093_23590" x1="221" y1="36" x2="133" y2="36" gradientUnits="userSpaceOnUse">
        <stop stop-color="#3CE5D3" stop-opacity="0" />
        <stop offset="0.515805" stop-color="#3CE5D3" />
        <stop offset="1" stop-color="#3CE5D3" stop-opacity="0" />
      </linearGradient>
      <linearGradient id="paint4_linear_1093_23590" x1="0" y1="5" x2="354" y2="5" gradientUnits="userSpaceOnUse">
        <stop stop-color="#3CE5D3" stop-opacity="0" />
        <stop offset="0.512" stop-color="#3CE5D3" stop-opacity="0.9375" />
        <stop offset="1" stop-color="#3CE5D3" stop-opacity="0" />
      </linearGradient>
    </defs>
  </svg>
);

export default headerTitleBackground;
